<template>
<div class="add">
    <div class="header">
      <HeaderCom leftText="新增地址"  :leftArrow="true"  />
    </div>
       <van-address-edit
  :area-list="areaList"
  show-postal
  show-delete
  show-set-default
  show-search-result
  :search-result="searchResult"
  :area-columns-placeholder="['请选择', '请选择', '请选择']"
  @save="onSave"
  @delete="onDelete"
  @change-detail="onChangeDetail"
/>
</div>
</template>

<script>
import HeaderCom from '@/components/header/headerCom.vue'
import {address_add} from '../utils/api'
import { mapState,mapMutations,mapGetters,mapActions } from 'vuex'
import { Toast } from 'vant';

export default {
    components:{
        HeaderCom,
    },
   data() {
    return {
      areaList,
      searchResult: [],
    };
  },
  methods: {
    onSave() {
      Toast('save');
    },
    onDelete() {
      Toast('delete');
    },
    onChangeDetail(val) {
      if (val) {
        this.searchResult = [
          {
            name: '雁塔区',
            address: '南窑国际',
          },
        ];
      } else {
        this.searchResult = [];
      }
    },
  },
    mounted(){
        // this.$store.dispatch('request_address_list');
    },
    computed:{
        // ...mapState(['userid']),
        // ...mapState(['addresslist']),
    },
    methods:{
        ...mapActions(['request_address_build']),
        // handelclick(){
            // this.input.userid = JSON.parse(localStorage.getItem('userinfo')).id;
        //     address_add(this.input).then((res)=>{
        //     console.log(res.data);
        // })
        // this.$store.dispatch('request_address_build',this.input);
        // this.$store.dispatch('request_address_list');
        // this.$router.go(-1);
        // }
        
    }
}

</script>

<style lang="scss" scoped>
::v-deep .van-nav-bar__text{
  color: #000;
}
::v-deep .capsule{
     background-color: rgba(	rgb(248, 241, 241), 0.5);
 }
 ::v-deep .van-nav-bar .van-icon{
        color: #000;
  }
</style>